<template>
  <div class="list">
    <a-tabs v-model:activeKey="activeKey">
      <a-tab-pane key="backup" tab="数据备份">
        <backup />
      </a-tab-pane>
      <a-tab-pane key="recovery" tab="数据恢复">
        <recovery />
      </a-tab-pane>
    </a-tabs>
  </div>
</template>
<script lang="ts" setup>
import card from '@/components/card.vue'
import { ref } from 'vue'
import Recovery from './recovery.vue'
import Backup from './backup.vue'

const activeKey = ref('backup')
</script>
<style scoped lang="less">
.list {
  background: #ffffff;
  padding: 10px 20px 20px 20px; // tab顶部已有padding
  height: 100%;
  flex: 1;
  overflow: hidden;
  .title-wrap {
    display: flex;
    white-space: nowrap;
    align-items: center;
    span {
      margin-right: 12px;
    }
  }
}
</style>
